import React, { Component } from 'react';

class App extends Component {

  // 使用 es7 类的属性和方法 --------- 推荐使用
  // 初始状态一定要放在 state 中，在 state 中你可以自定义自己想要的属性
  // 因为我们需要使用 setState 来进行值的改变
  state = {
    msg: '你好中国'
  }


  render() {
    return (
      <div>
        App <h1>{this.state.msg}</h1>


        <button onClick={()=>{

          // setState 中的第一个参数可以是一个对象，对象中的内容就是我们要修改的值
          // 也可以是一个函数，函数中有两个参数，第一个是上一次的值，第二个是父组件传递的值
          // 该函数中返回值是一个对象，该对象中的内容就是我们要修改的内容
          // prevState：获取到上一次 state 中的值
          // props：父组件传递过来的属性
          this.setState((prevState, props)=>{
            console.log(prevState, props);
            return {
              msg: '你好世界'
            }
          })

        }}>点击修改 msg</button>
      </div>
    );
  }
}

export default App;
